<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="utf-8">
  <title>后台项目管理</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" th:href="@{/layui/dist/css/view.css}"/>
  <link rel="stylesheet" th:href="@{/layui/dist/css/layui.css}"  media="all">
    <link rel="stylesheet" type="text/css" th:href="@{/css/bootstrap.min.css}">
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body class="layui-view-body">
<div class="layui-content">
    <div class="layui-page-header">
        <div class="pagewrap">
            <div class="pagewrap" style="height: 80px;">
                <div style="margin-left: 50px;margin-top: 30px;">
                    <font size="6">项目列表</font>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-card">
            <div class="layui-card-body">
                <div class="form-box">
                    <form th:action="@{/itemsList}" method="post">
                        <div class="layui-form layui-form-item">
                            <div class="layui-inline">
                                <div class="layui-form-mid">项目类型:</div>
                                <div class="layui-input-inline" style="width: 115px;">
                                    <select name="itemType">
                                        <option value="">请选择</option>
                                        <option th:selected="${itemType == '1'}" value="1">web网站</option>
                                        <option th:selected="${itemType == '2'}" value="2">App开发</option>
                                        <option th:selected="${itemType == '3'}" value="3">微信公众号</option>
                                        <option th:selected="${itemType == '4'}" value="4">小程序</option>
                                        <option th:selected="${itemType == '5'}" value="5">HTML应用</option>
                                        <option th:selected="${itemType == '6'}" value="6">其他项目</option>
                                    </select>
                                </div>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                <div class="layui-form-mid">项目审核状态:</div>
                                <div class="layui-input-inline" style="width: 100px;">
                                    <select name="itemCondition">
                                        <option value="">请选择</option>
                                        <option th:selected="${itemCondition == '1'}" value="1">通过</option>
                                        <option th:selected="${itemCondition == '2'}" value="2">不通过</option>
                                        <option th:selected="${itemCondition == '3'}" value="3">未审核</option>
                                    </select>
                                </div>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                <div class="layui-form-mid">项目状态:</div>
                                <div class="layui-input-inline" style="width: 115px;">
                                    <select name="itemDid">
                                        <option value="">请选择</option>
                                        <option th:selected="${itemDid == '1'}" value="1">正在招募中</option>
                                        <option th:selected="${itemDid == '2'}" value="2">正在进行中</option>
                                        <option th:selected="${itemDid == '3'}" value="3">已完成</option>
                                    </select>
                                </div>
                                <button class="layui-btn layui-btn-blue" type="submit">查询</button>
                            </div>
                        </div>
                    </form>

                    <table class="layui-table">
                        <colgroup>
                            <!--<col width="">-->
                            <!--<col width="200">-->
                            <!--<col>-->
                        </colgroup>
                        <thead>
                        <tr>
                            <th>项目编号</th>
                            <th>项目名称</th>
                            <th>项目类型</th>
                            <th>发布者编号</th>
                            <th>发布者姓名</th>
                            <th>项目审核状态</th>
                            <th>项目状态</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="sysItems:${sysItemsList}">
                            <td th:text="${sysItems.itemNo}">项目编号</td>
                            <td th:text="${sysItems.itemName}">项目名称</td>
                            <td th:text="${sysItems.itemType} == '1' ? 'web网站'
                                : (${sysItems.itemType} == '2' ? 'App开发'
                                : (${sysItems.itemType} == '3' ? '微信公众号'
                                : (${sysItems.itemType} == '4' ? '小程序'
                                : (${sysItems.itemType} == '5' ? 'HTML应用' : '其他项目')
                                )
                                )
                                )
                                ">项目类型</td>
                            <td th:text="${sysItems.promulgatorId}">发布者编号</td>
                            <td th:text="${sysItems.codeUsers[0].username}" >发布者姓名</td>
                            <td th:text="${sysItems.itemCondition} == '1' ? '通过'
                                : (${sysItems.itemCondition} == '2' ? '不通过' : '未审核'
                                )
                                ">项目审核状态</td>
                            <td th:text="${sysItems.itemDid} == '1' ? '正在招募中'
                                : (${sysItems.itemDid} == '2' ? '正在进行中' : '已完成'
                                )
                                ">项目状态</td>
                            <td>
                                <button class="layui-btn layui-btn-sm" type="button" th:if="${sysItems.itemCondition} != '3'"
                                        th:onclick="'showItemsDetail(' + ${sysItems.itemNo} + ')' ">查看项目详情</button>
                                <button class="layui-btn layui-btn layui-btn-warm"  type="button" th:if="${sysItems.itemCondition} == '3'"
                                         th:onclick="'checkItems(' + ${sysItems.itemNo} + ')' ">审核</button>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                    <!--分页导航-->
                    <div class="pagination center pagination-large pt-20" style="margin-left: 30%">
                        <div class="row text-center">
                            <div class="col-md-12">
                                <ul class="pagination">
                                    <li><a th:class="${currentPage eq 1 ? 'btn disabled' : '' }" href="javascript:;" th:href="@{/itemsList(page=1,itemType=${itemType},itemCondition=${itemCondition},itemDid=${itemDid})}">首页</a></li>
                                    <li><a th:class="${currentPage eq 1 ? 'btn disabled' : '' }" href="javascript:void(0);" th:href="@{/itemsList(page=${currentPage}-1,itemType=${itemType},itemCondition=${itemCondition},itemDid=${itemDid})}">&laquo;</a></li>

                                    <li th:class="${page eq currentPage} ? 'active' : ''" th:each="page:${#numbers.sequence(1,totalPage)}">
                                        <a href="javascript:void(0);" th:href="@{/itemsList(page=${page},itemType=${itemType},itemCondition=${itemCondition},itemDid=${itemDid})}" th:text="${page}">1</a>
                                    </li>

                                    <li><a th:class="${currentPage eq totalPage ? 'btn disabled' : '' }" href="javascript:void(0);" th:href="@{/itemsList(page=${currentPage}+1,itemType=${itemType},itemCondition=${itemCondition},itemDid=${itemDid})}">&raquo;</a></li>
                                    <li><a th:class="${currentPage eq totalPage ? 'btn disabled' : '' }" href="#" th:href="@{/itemsList(page=${totalPage},itemType=${itemType},itemCondition=${itemCondition},itemDid=${itemDid})}" style="border: 1px solid #ddd;">尾页</a></li>
                                    <li><a style="border: 0px;margin-left: 0px;">当前页<span th:text="${currentPage}"></span>/<span th:text="${totalPage}"></span>总页</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    <script th:src="@{/layui/dist/layui.all.js}" charset="utf-8"></script>
    <script th:src="@{/js/jquery.min.js}" charset="utf-8"></script>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="enable">启用</a>
    <a class="layui-btn layui-btn-xs" lay-event="disable" style="background-color: #ff0000;">禁用</a>
</script>
    <script>
        //弹出层 显示项目详细信息
        function showItemsDetail(itemNo){
            layer.open({
                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                type:2,
                title:"项目详细信息",
                area: ['90%','90%','left:126px'],
                content:'/code/itemsDetail?itemNo=' + itemNo
            });

        }

        //弹出层 审核项目
        function checkItems(itemNo){
            layer.open({
                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                type:2,
                title:"审核项目",
                area: ['90%','90%','left:126px'],
                content:'/code/checkItems?itemNo=' + itemNo

                // end: function () {
                //     window.location.reload();
                // }
            });
        }
    </script>

</body>
</html>
